<template>
	<view class="flex_c_c page">
		<view class="text_38 title" style="font-weight: 600;" v-if="type == 2">
			你好,<br>
			请填写手机号
		</view>
		<view class="text_38 title" style="font-weight: 600;" v-if="type == 1">
			密码登录
		</view>
		<view class="form">
			<view class="flex_r form-row">
				<view class="text_34 form-row-title">
					+86
				</view>
				<view class="flex1 form-row-input">
					<input v-model="formData.loginname" type="text" placeholder="请输入手机号">
				</view>
				<view class="m-line">
					<m-line color="#B8B8B8" length="100%" :hairline="true"></m-line>
				</view>
			</view>
			<view class="flex_r form-row" v-if="type == 2">
				<view class="text_34 form-row-title">
					验证码
				</view>
				<view class="flex1 form-row-input">
					<input v-model="formData.code" type="text" placeholder="请输入验证码">
				</view>
				<view class="form-row-code" @click="sms">
					{{ countDownText }}
				</view>
				<view class="m-line">
					<m-line color="#B8B8B8" length="100%" :hairline="true"></m-line>
				</view>
			</view>

			<view class="flex_r form-row" v-if="type == 1">
				<view class="text_34 form-row-title">
					密码
				</view>
				<view class="flex1 form-row-input">
					<input v-model="formData.password" type="password" placeholder="请输入密码">
				</view>
				<view class="m-line">
					<m-line color="#B8B8B8" length="100%" :hairline="true"></m-line>
				</view>
			</view>
			<view style="position:absolute; left:30px;" @click="type=1" v-if="type == 2">账号密码登录</view>
			<view style="position:absolute; left:30px;" @click="type=2" v-if="type == 1">验证码登录</view>
			<view style="position:absolute; right:30px;" @click="goRegister">注册</view>
		</view>

		<view class="botton">
			<view class="size_white text_30 button" style="background-color: #030303; border-radius: 10rpx; color: #fff;" @click="submit">
				验证并登录
			</view>
			<view class="icon_ agreement">
				<view class="icon_ checkbox" @click="change">
					<view class="checkbox-box" v-if="checked">
						<image class="img" src="" mode="aspectFill"></image>
					</view>
				</view>
				<view class="">
					阅读并同意<span @click="goPrivacy">《隐私政策》</span>
					和<span @click="goAgreement">《用户协议》</span>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
// 按照自己的路径去引入,路径一定不要错
import md5 from '@/utils/md5.js';

import { genTestUserSig } from '../debug/GenerateTestUserSig.js';
	import {
		show,
		to
	} from '@/utils/index.js';
	export default {
		data() {
			return {
				checked:false,
				countDowntime:60,
				isCountDown: false, // 是否正在倒计时
				countDownText: '获取验证码', // 倒计时文本
				type: 2,
				formData: {
					loginname: '',
					code: '',
					password: ''
				}
			}
		},
		onLoad() {
		},
		methods: {
			to,
			change(e) {
				this.checked = !this.checked 
			},
			async sms(){
			   if (this.isCountDown) return;		
				let res = await this.$c.post('/app/zhuce/sendCode?loginname='+this.formData.loginname)
				if(res.code != 0){
					uni.showToast({
					  title: res.msg,
					  duration: 1000,
					  icon: 'none'
					});
				}else{
					this.isCountDown =true;
					this.downtime();
					uni.showToast({
					  title: '短信已发送',
					  duration: 1000,
					  icon: 'none'
					});
				}
			},
			downtime()
			{
				this.timer = setInterval(() => {
					if(this.countDowntime>0)
					{
						this.countDowntime--;
						this.countDownText = this.countDowntime+'后再发送';
					}else
					{   this.isCountDown=false;
						clearInterval(this.timer);
						this.countDowntime =60;
						this.countDownText ='获取验证码';						
					}
				}, 1000);
			},
			goAgreement(){
				app.globalData.webviewUrl='https://popose.ptszyxx.com/index.php?m=home&c=Lists&a=index&tid=47'
				uni.navigateTo({
					url: '/pages/webview/webview'
				})
			},
			goPrivacy() {
				app.globalData.webviewUrl='https://popose.ptszyxx.com/index.php?m=home&c=Lists&a=index&tid=46'
				// app.globalData.webviewUrl='https://poposeapi.ptszyxx.com/apa/protocol'
				uni.navigateTo({
					url: '/pages/webview/webview'
				})
			},
			
			
			goRegister(){
				uni.navigateTo({
					url: '/pages/m-pages/m-login/register'
				})
			},
			async loginTo() {
			  let userID = this.username;
			  uni.showToast({
			    title: '登录中...',
			    duration: 3000,
			    icon: 'none'
			  });
			  // 发送请求
			  let url = '&password=' + md5.hex_md5(this.formData.password);
			  if(2 == this.type){
			  	url = '&code=' + this.formData.code;
			  }
			  let res = await this.$c.post('/app/login/login?loginname=' + this.formData.loginname + '&loginType=' + this.type + url);
			
			  if (res.code != 0) {
			  	this.$c.show(res.msg);
			  	return;
			  }
			  let token = res.data.token
			  userID = res.data.user.tengxuncode.toString();
			  const userSig = genTestUserSig(userID).userSig;
			  let iswanshan=res.data.user.iswanshan;
			  
			  
			  //获得sign
			 //  res = await this.$c.post('/app/tx/getUserSig);
			 //  if (res.code != 0) {
				// this.$c.show(res.msg);
				// return;
			 //  }
			 //  userSig = res.data.userSig;
			  app.globalData.userInfo = {
				token,
			    userSig,
			    userID
			  };
			
			  uni.setStorageSync('userInfo', app.globalData.userInfo);
			
			  // 登录腾讯im
			  uni.$TUIKit
			    .login({
			      userID: userID,
			      userSig: userSig
			    })
			    .then(res => {
			      this.$store.commit('setToken', app.globalData.userInfo);
			    })
			    .catch((err) => {
					console.log(err)
					// setTimeout(() => {
					//   uni.switchTab({
					//     // url: '/pages/msg'
					// 			  // url: '/pages/m-pages/m-home/index',
					// 			  url: '/pages/m-pages/m-personnelList/index'
					//   });
					// }, 3000);
				});
			  // 登录 native 原生通话插件
			  // #ifdef  APP-PLUS
			  uni.$TUICallKit.login(
			    {
			      sdkAppID: genTestUserSig('').sdkAppID,
			      userID: app.globalData.userInfo.userID,
			      userSig: app.globalData.userInfo.userSig
			    },
			    res => {
			      console.log('app视频通话登录成功');
			    }
			  );
			  // #endif
			  if (iswanshan == 2) {
			  	uni.navigateTo({
			  		url: '/pages/m-pages/m-login/completeInfo'
			  	})					
			  } else {
			  	setTimeout(() => {
			  		uni.switchTab({
			  			 url: '/pages/m-pages/m-personnelList/index'
			  		});
			  	}, 3000);
			  }		
			},
			submit() {
				
				if(!this.checked){
					  uni.showToast({
						  icon:"none",
						title:"请先同意用户协议"
					  })
					  return;
				}
				this.loginTo()
				// let formDataCheck = {
				// 	a: '请输入a',
				// 	b: '请输入b',
				// 	c: '请输入c',
				// 	d: '请输入d'
				// };
				// let data = {}
				// for (const key in this.formData) {
				// 	if (this.formData[key]) {
				// 		data[key] = this.formData[key]
				// 	} else {
				// 		return show(`请填写${formDataCheck[key]}`);
				// 		break;
				// 	}
				// }
				// console.log(data)
			}
		}
	}
</script>

<style scoped lang="scss">
	.page {
		position: relative;
		box-sizing: border-box;
		padding: 0 50rpx;
		width: 100%;
		height: 100vh;
		margin: 0 auto;
	}

	.top {
		position: absolute;
		top: 0;
		left: 40rpx;
		width: 100%;
		height: 100rpx;
		.top-icon {
			width: 44rpx;
			height: 44rpx;
		}
	}

	.title {
		width: 100%;
		// height: 200rpx;
		// line-height: 200rpx;
		margin-bottom: 20rpx;
	}

	.form {
		width: 100%;

		.form-row {
			position: relative;
			width: 100%;
			height: 100rpx;
			margin-bottom: 20rpx;

			.form-row-title {
				width: 170rpx;
				line-height: 100rpx;
			}

			.form-row-input {
				height: 100%;

				input {
					width: 100%;
					height: 100%;
				}
			}

			.form-row-code {
				box-sizing: border-box;
				padding-left: 10rpx;
				line-height: 100rpx;
				// color: #e6166a;
			}

			.m-line {
				position: absolute;
				width: 100%;
				left: 0;
				bottom: 0;
				right: 0;
			}
		}
	}

	.botton {
		width: 100%;
		margin-top: 140rpx;
		margin-bottom: 100rpx;

		.button {
			width: 100%;
			height: 90rpx;
			border-radius: 20rpx;
			text-align: center;
			line-height: 90rpx;
			background-color: #e6166a;
			margin-bottom: 20rpx;
		}

		.agreement {
			width: 100%;
			height: 50rpx;

			.checkbox {
				width: 48rpx;
				height: 48rpx;
				border-radius: 50%;
				box-sizing: border-box;
				border: 1px solid #000;
				margin-right: 20rpx;
				.checkbox-box {
					width: 40rpx;
					height: 40rpx;
					box-sizing: border-box;
				}
			}
		}

	}
</style>